<template>
  <div>
    <zbTable ref="tableRef" :api-fun="get_repair_order_list" @action="action" />

    <!-- 维修处理弹窗 -->
    <repair
      v-if="showRepair"
      v-model:visible="showRepair"
      :order_sn="order_sn"
      @done="done"
    />
    <!-- 完成维修弹窗 -->
    <over
      v-if="showOver"
      v-model:visible="showOver"
      :order_sn="order_sn"
      @done="done"
    />
    <!-- 支付弹窗 -->
    <pay
      v-if="showPay"
      v-model:visible="showPay"
      :order_sn="order_sn"
      :money="money"
      from="repair"
      @done="done"
    />
  </div>
</template>
<script setup>
  import { ref, unref, reactive } from 'vue';
  import { message, Modal } from 'ant-design-vue';
  import { actionFn } from '@/utils/action.js';
  import { daochuFn } from '@/utils/daochu.js';
  import { PlusOutlined, UploadOutlined } from '@ant-design/icons-vue';
  import { useRouter } from 'vue-router';
  import zbTable from './components/purchasePurchaseIndex.vue';
  import repair from './components/repair.vue';
  import over from './components/over.vue';
  import pay from '../../order/jewelry_order/components/pay.vue';
  import { get_repair_order_list } from '@/api/order/repair_order';
  // 是否显示编辑弹窗
  const tableRef = ref(null);
  const router = useRouter();
  const { push } = useRouter();
  const editData = ref({});
  const actionData = ref({});
  const order_sn = ref(null);
  const showRepair = ref(false);
  const showOver = ref(false);
  const showPay = ref(false);
  const money = ref(null);

  const action = (data) => {
    console.log('data--22222--', data);
    editData.value = data.row_data;
    actionData.value.url = data.action_data.url;
    if (data.action_data.type == 'add') {
      push({
        path: '/order/repair_order/add',
        query: {
          member_id: data.row_data.id
        }
      });
    } else if (data.action_data.type == 'edit') {
      push({
        path: '/order/repair_order/add',
        query: {
          order_sn: data.row_data.order_sn
        }
      });
    } else if (data.action_data.type == 'detail') {
      push({
        path: '/order/repair_order/detail',
        query: {
          order_sn: data.row_data.order_sn,
          bar_code: data.row_data.bar_code,
          member_id: data.row_data.member_id
        }
      });
    } else if (data.action_data.type == 'handle') {
      order_sn.value = data.row_data.order_sn;
      showRepair.value = true;
    } else if (data.action_data.type == 'complete') {
      order_sn.value = data.row_data.order_sn;
      showOver.value = true;
    } else if (data.action_data.type == 'pay') {
      order_sn.value = data.row_data.order_sn;
      money.value = data.row_data.real_amount;
      showPay.value = true;
    } else if (data.action_data.type == 'recall') {
      Modal.confirm({
        title: '提示',
        content: '确定撤回?',
        maskClosable: false,
        onOk: () => {
          done({ order_sn: data.row_data.order_sn });
        }
      });
    } else if (data.action_data.type == 'cancel') {
      Modal.confirm({
        title: '提示',
        content: '确定作废?',
        maskClosable: false,
        onOk: () => {
          done({ order_sn: data.row_data.order_sn });
        }
      });
    } else if (data.action_data.type == 'extract') {
      Modal.confirm({
        title: '提示',
        content: '确定提货?',
        maskClosable: false,
        onOk: () => {
          done({ order_sn: data.row_data.order_sn });
        }
      });
    }
  };

  const done = (form) => {
    if (form.type && form.type == 'next1') {
      actionFn(actionData.value, form, next1);
    } else if (form.type && form.type == 'next2') {
      money.value = form.real_amount;
      actionFn(actionData.value, form, next2);
    } else {
      actionFn(actionData.value, form, reloadTable);
    }
  };
  const next1 = () => {
    console.log('next1====');
    actionData.value.url = 'order/repair_order/complete';
    showRepair.value = false;
    showOver.value = true;
  };
  const next2 = () => {
    console.log('next2====');
    actionData.value.url = 'order/repair_order/pay';
    showOver.value = false;
    showPay.value = true;
  };
  const reloadTable = () => {
    showRepair.value = false;
    showOver.value = false;
    showPay.value = false;
    tableRef.value.reload();
  };
</script>
